<div id="addCustomerProductFormDiv" style="height: 100%">
  <form class="layui-form open-form" id="addCustomerProductForm" lay-filter="addCustomerProductForm">
    <div class="open-model">
      <div class="open-auto">
        <div class="open-details-title" style="margin-bottom: 20px">入库作业</div>
        <!--        <input name="id" disabled-->
        <!--               class="layui-input" type="hidden">-->
        <input type="text" name="warehouseOrderId" hidden />
        <input type="text" name="signInRecordId" hidden />
        <input type="text" name="warehouseFactoryShelfSpaceId" hidden />
        <input type="text" name="warehouseAreaId" hidden />
        <input type="text" name="inventoryTypeId" hidden />
        <input type="text" name="qualityTestingId" hidden />
        <input type="text" name="customerId" hidden />
<!--        <div class="layui-col-md3">-->
<!--          <div class="layui-form-item">-->
<!--            <label class="layui-form-label">产品SKU编号</label>-->
<!--            <input type="text" name="warehouseProductId" hidden />-->
<!--            <div class="layui-input-inline">-->
<!--              <input name="customerProductCode" type="text" class="layui-input" disabled class="layui-input" />-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->
        <div class="layui-col-md3">
          <div class="layui-form-item">
            <label class="layui-form-label">规格号</label>
            <div class="layui-input-inline">
              <input type="text" name="specifications" disabled class="layui-input" />
            </div>
          </div>
        </div>

<!--        <div class="layui-col-md3">-->
<!--          <div class="layui-form-item">-->
<!--            <label class="layui-form-label">产地/厂家</label>-->
<!--            <div class="layui-input-inline">-->
<!--              <input type="text" name="customerName" disabled class="layui-input" />-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->

<!--        <div class="layui-col-md3">-->
<!--          <div class="layui-form-item">-->
<!--            <label class="layui-form-label">品种</label>-->
<!--            <div class="layui-input-inline">-->
<!--              <input type="text" name="productVarietyName" disabled class="layui-input" />-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->

<!--        <div class="layui-col-md3">-->
<!--          <div class="layui-form-item">-->
<!--            <label class="layui-form-label">牌号</label>-->
<!--            <div class="layui-input-inline">-->
<!--              <input type="text" name="productMarkName" disabled class="layui-input" />-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->
        <div class="layui-col-md3">
          <div class="layui-form-item">
            <label class="layui-form-label">入库仓库</label>
            <div class="layui-input-inline">
              <input type="text" name="warehouseFactoryAdministrationName" disabled class="layui-input" />
              <input type="text" name="warehouseFactoryAdministrationId" hidden />
            </div>
          </div>
        </div>
<!--        <div class="layui-col-md3">-->
<!--          <div class="layui-form-item">-->
<!--            <label class="layui-form-label">仓库性质</label>-->
<!--            <div class="layui-input-inline">-->
<!--              <input type="text" name="warehouseTypeName" disabled class="layui-input" />-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->
<!--        <div class="layui-col-md3">-->
<!--          <div class="layui-form-item">-->
<!--            <label class="layui-form-label">所属客户</label>-->
<!--            <input type="text" name="customerId" hidden />-->
<!--            <div class="layui-input-inline">-->
<!--              <input type="text" name="customerName" disabled class="layui-input" />-->
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->

        <div class="layui-col-md3">
          <div class="layui-form-item">
            <label class="layui-form-label">入库数量</label>
            <div class="layui-input-inline">
              <input type="text" name="inventoryQuantity" disabled class="layui-input" />
            </div>
          </div>
        </div>
        <div class="layui-col-md3">
          <div class="layui-form-item">
            <label class="layui-form-label">总毛重</label>
            <div class="layui-input-inline">
              <input type="text" name="netWeight" disabled class="layui-input" />
            </div>
          </div>
        </div>
        <div class="layui-col-md3">
          <div class="layui-form-item">
            <label class="layui-form-label">总净重</label>
            <div class="layui-input-inline">
              <input type="text" name="grossWeight" disabled class="layui-input" />
            </div>
          </div>
        </div>
        <div class="open-details-title" style="margin-bottom: 5px">入库信息</div>
        <!-- {{# if(d.eventName!="detail"){ }} -->
        <button class="layui-btn" id="addTableData" style="margin-top: 15px">添加入库作业物资</button>
        <!-- {{# } }} -->

        <table class="layui-table" id="customerProductsTable" lay-filter="customerProductsTable"></table>
      </div>
      <div class="layui-form-item text-right">
        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        <!-- 客服代表, 客户物料名称, 客户物料编码 -->
        <!-- 提交按钮 -->
        <!-- {{# if(d.eventName!='detail'){ }} -->
        <button class="layui-btn" lay-filter="addCustomerProductBtn" lay-submit>保存</button>
        <!-- {{# } }} -->
      </div>
    </div>
  </form>
</div>

<script type="text/html" id="barterTableBar">
  <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</button>
  <!--    <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="detail">详情</button>-->
</script>
<script>
  layui.use(["form", "table", "laydate", "layedit", "laydate"], async function () {
    $ = layui.jquery;
    var form = layui.form;
    var admin = layui.admin;
    var table = layui.table;
    var upload = layui.upload;
    var config = layui.config;
    var laytpl = layui.laytpl;
    let nowData = { ...parentData };
    let data = nowData.data;
    let productTypeList = [];
    // admin.req(
    //   "enterprise/product/admin/productType/list",
    //   {
    //     nowData
    //   },
    //   function (res) {
    //     productTypeList = res.data;
    //     table.reload("customerProductsTable");
    //   }
    // );
    console.log("nowData", nowData);

    form.val("addCustomerProductForm", { ...nowData.data, ...nowData.formData });

    const res = await admin.reqPro("warehouse/warehouse/product/selectProductDetail?status=1", { qualityTestingId: nowData.data.qualityTestingId });
    // 筛选出状态为可选的条码
    //1、发货 2、签收 3、入库 4、出库,7.加工完成
    const BundleList = res.data.filter((v) => v.productStatus == 7);

    table.render({
      elem: "#customerProductsTable",
      page: false,
      height: 300,
      data: [],
      cols: [
        [
          {
            field: "sysBundleCode",
            title: "条码（唯一码）",
            templet: admin.setTableSelect(
              "sysBundleCode",
              BundleList.map((v) => {
                return {
                  label: v.sysBundleCode,
                  value: v.sysBundleCode
                };
              }),
              false,
              "sysBundleCode"
            )
          },
          {
            field: "userBundleCode",
            title: "捆包码"
          },

          {
            field: "unit",
            title: "入库单位"
          },
          {
            field: "grossWeight",
            title: "毛重"
          },
          {
            field: "netWeight",
            title: "净重"
          },
          {
            field: "proUnitId",
            title: "备注"
          },
          {
            title: "操作",
            toolbar: "#barterTableBar", // 绑定操作按钮
            align: "center"
          }
        ]
      ],
      done: function (data) {
        form.val("addCustomerProductForm", {
          creatorName: table.cache["customerProductsTable"].filter((v) => v.sysBundleCode).length
        });
      }
    });

    // 监听删除按钮点击事件
    table.on("tool(customerProductsTable)", function (obj) {
      var data = obj.data; // 获得当前行数据
      if (obj.event === "del") {
        event.preventDefault(); // 阻止默认行为
        layer.confirm("确定删除该条数据？", function (index) {
          // 获取当前行的索引
          var rowIndex = $(obj.tr).data("index");

          // 从缓存中删除对应的数据
          let tableData = table.cache["customerProductsTable"];
          tableData.splice(rowIndex, 1); // 根据索引删除数据

          // 更新表格
          table.reload("customerProductsTable", { data: tableData });

          layer.close(index);

          // 重新计算入库数量、净重、毛重
          form.val("addCustomerProductForm", {
            inventoryQuantity: tableData.filter((v) => v.sysBundleCode).length,
            netWeight: tableData.reduce((a, b) => a + Number(b.netWeight || 0), 0),
            grossWeight: tableData.reduce((a, b) => a + Number(b.grossWeight || 0), 0)
          });
        });
      }
    });

    $("#addCustomerProductFormDiv .layui-table-body").css("overflow", "visible");
    $("#addCustomerProductFormDiv .layui-table-box").css("overflow", "visible");
    $("#addCustomerProductFormDiv .layui-table-view").css("overflow", "visible");
    admin.tableSelectChange("customerProductsTable", "sysBundleCode", (index, value, tableData, field) => {
      let obj = BundleList.find((v) => v.sysBundleCode == value);
      obj = {
        sysBundleCode: obj.sysBundleCode,
        userBundleCode: obj.userBundleCode,
        unit: obj.unit,
        grossWeight: obj.grossWeight,
        netWeight: obj.netWeight,
        proUnitId: obj.proUnitId,
        id: obj.id
      };

      if (tableData.filter((v) => v.sysBundleCode == value).length > 1) {
        layer.msg("条码已存在");
        tableData[index].sysBundleCode = "";
        table.reload("customerProductsTable", {
          data: tableData
        });
        return;
      }
      tableData[index] = obj;
      table.reload("customerProductsTable", {
        data: tableData
      });
      form.val("addCustomerProductForm", {
        inventoryQuantity: tableData.filter((v) => v.sysBundleCode).length,
        netWeight: tableData.reduce((a, b) => a + Number(b.netWeight || 0), 0),
        grossWeight: tableData.reduce((a, b) => a + Number(b.grossWeight || 0), 0)
      });
    });

    $("#addTableData").click(function () {
      let list = table.cache["customerProductsTable"];
      list.unshift({
        sysBundleCode: "",
        userBundleCode: "",
        unit: "",
        grossWeight: "",
        netWeight: "",
        proUnitId: "",
        id: ""
      });
      table.reload("customerProductsTable", {
        data: list
      });
      return false;
    });

    // 监听提交
    form.on("submit(addCustomerProductBtn)", function (d) {
      const formData = { ...d.field };
      let list = table.cache["customerProductsTable"];
      formData.warehouseProductInventoryVoList = list;
      admin.req(
        "warehouse/warehouse/finishedProductStorageRecord/addStorage",
        JSON.stringify(formData),
        function (res) {
          layer.closeAll("loading");
          if (res.code == 200) {
            layer.msg("入库成功", { icon: 1 });
            table.reload("purchaseSignTaskTable");
            layer.closeAll("page");
          } else {
            layer.msg(res.msg, { icon: 2, time: 1000 });
          }
        },
        "POST",
        true,
        "application/json; charset=utf-8"
      );
      return false;
    });
  });
</script>

<style>
  #addCustomerProductFormDiv .layui-form-label {
    width: 100px;
  }
  #addCustomerProductFormDiv .layui-form-item .layui-input-inline {
    width: 170px;
  }
  #addCustomerProductFormDiv .layui-table-cell {
    overflow: visible !important;
  }
</style>
